<!-- 图片修改 -->
<template>
	<view>
		<view class="u-m-t-30 m-mg-lr borwid m-bg-w u-p-20 u-rela">
			<view class="u-flex u-flex-wrap u-flex-items-center">
				<view class="u-m-l-10 u-m-t-30 boxqie u-rela" v-for="(item,index) in images" :key='index'>
					<u--image :src='item' width='100' height='100' radius='5'></u--image>
					<view class="u-abso boxdd" @click="getde(index)">
						<u-icon name="close-circle-fill" size="20" color="#514E4C"></u-icon>
					</view>
				</view>
				<view class="box u-m-l-10 u-m-t-30 u-flex u-flex-center u-flex-items-center" @click="getimg">
					<u-icon name="plus" size="50"></u-icon>
				</view>
			</view>
			<view class="u-m-t-30 m-c-h">
				至少上传5张图片
			</view>
			<view class="m-mg-lr u-abso boxjiao" @click="getti">
				提交
			</view>
		</view>
		<view style="height: 20rpx;"></view>
	</view>
</template>

<script>
	import uploadImage from '@/js_sdk/yushijie-ossutil/ossutil/uploadFile.js';
	export default {
		data() {
			return {
				jiekou: null,
				fromData: {},
				images: [],
				type: null
			};
		},
		async onLoad(e) {
			if (e.id) {
				if (!e.type) {
					this.jiekou = +e.id;
					let res = await this.require('gettowhouse', {
						id: +e.id
					});
					if (res) {
						this.fromData = res;
						this.images = [...res.images.split(',')];
					}
				} else {
					this.type = +e.type
					console.log(this.type, '获取到啦')
					this.jiekou = +e.id;
					let res = await this.require('getAouse', {
						id: +e.id
					});
					if (res) {
						this.fromData = res;
						this.images = [...res.images.split(',')];
					}
				}

			}
		},
		methods: {
			getimg() {
				const that = this;
				that.loading_show_status = true;
				uni.chooseImage({
					sourceType: ['album', 'camera'],
					success: async res => {
						for (let i = 0; i < res.tempFilePaths.length; i++) {
							uni.showLoading({
								mask: true
							});
							uploadImage(
								res.tempFilePaths[i],
								'roomuploads/' + uni.$u.timeFormat(new Date(), 'yyyymmdd'),
								result => {
									that.images.push(result);
									uni.hideLoading();
								},
								result => {
									//这里写上传失败的代码
									uni.hideLoading();
								}
							);
						}
					}
				});
			},
			getde(ind) {
				this.images.splice(ind, 1);
			},
			async getti() {
				if (!this.type === 0) {
					if (this.images.length < 5) return uni.$u.toast('图片最少上传5张');
					this.fromData.images = this.images.join(',');
					let res = await this.require('revisetowhouse', this.fromData);
					if (res) {
						this.nextNav('/pages/tabbar/mine');
					}
				}else{
					if (this.images.length < 5) return uni.$u.toast('图片最少上传5张');
					this.fromData.images = this.images.join(',');
					let res = await this.require('revisehouse', this.fromData);
					if (res) {
						this.nextNav('/pages/tabbar/mine');
						console.log("修改好勒")
					}
				}

			}
		}
	}
</script>

<style lang="scss" scoped>
	.box {
		width: 100px;
		height: 100px;
		background-color: #eee;
		border-radius: 8rpx;
	}

	.borwid {
		min-height: 90vh;
		border-radius: 10rpx;
	}

	.boxqie {
		width: 100px;
		height: 100px;
		overflow: hidden;
		border-radius: 8rpx;
	}

	.boxdd {
		top: -8rpx;
		right: -8rpx;
	}

	.boxjiao {
		left: 0;
		right: 0;
		bottom: 30rpx;
		padding: 20rpx 60rpx;
		text-align: center;
		color: #fff;
		background-color: #0e5642;
		border-radius: 10rpx;
	}
</style>
